<div class="filter">
    <div class="f1 item" style="width: 110px;">
        <input type="text" class="am-form-field" placeholder="起始日期" id="start"
            data-am-datepicker="{theme:'success'}" readonly required />
    </div>
    <div class="f2 item" style="width: 110px;">
        <input type="text" class="am-form-field" placeholder="结束日期" id="end"
            data-am-datepicker="{theme:'success'}" readonly required />
    </div>
    <div class="f7 item">
        <select data-am-selected>
            <option value="-1">全部渠道</option>
            <option value="heyifuu">合易付</option>
            <option value="sslsf">闪付</option>
            <option value="xinmapay">新码</option>
        </select>
    </div>
    <div class="f8 item">
        <select data-am-selected>
            <option value="-1">全部充值方式</option>
            <option value="bank">网银</option>
            <option value="alipay">支付宝</option>
            <option value="wechat">微信</option>
            <option value="qq">QQ钱包</option>
        </select>
    </div>

    <div class="f9 item">
        <select data-am-selected>
            <option value="-1">全部状态</option>
            <option value="0">待付款</option>
            <option value="1">完成</option>
            <option value="2">失败</option>
        </select>
    </div>

    <div class="f5 item">
        <select>
            <option value="user">用户名</option>
            <option value="orderNo">商户订单号</option>
            <option value="tradeNo">平台订单号</option>
        </select>
    </div>
    <div class="f3 item">
        <input type="text" class="am-form-field" placeholder="" />
    </div>

    <div class="button item">
        <button type="button" class="am-btn am-btn-primary">查看</button>
    </div>

    <div class="f4 item" style="margin-left: 20px; color: red;">
        <label class="am-checkbox">
            <input type="checkbox" class="auto" value="" data-am-ucheck> 每8秒自动刷新
        </label>
    </div>
</div>

<table class="am-table am-table-bordered am-table-striped am-table-compact" id="result-table">
  <thead>
  <tr>
    <th style="width:240px;">订单号</th>
    <th width="100px">申请时间</th>
    <th width="100px">处理时间</th>
    <th width="100px">用户</th>
    <th width="60px">层级</th>
    <th>充值渠道</th>
    <th width="60px">充值金额</th>
    <th>摘要</th>
    <th width="60px">状态</th>
    <th>操作</th>
  </tr>
  </thead>
  <tbody>
  </tbody>
</table>
<div class="zxf_pagediv"></div>

<style type="text/css">
    #result-table td {
        line-height: 20px;
        vertical-align: middle;
        padding: 8px 4px 8px 4px;
    }
</style>

<script>
    $(".f1 input").datepicker({format: 'yyyy-mm-dd'});
    $(".f2 input").datepicker({format: 'yyyy-mm-dd'});
    $(".f1 input").datepicker("setValue", new Date().Format("yyyy-MM-dd"))
    $(".f2 input").datepicker("setValue", new Date().Format("yyyy-MM-dd"))
    Util.restorePageFilter();

    var _f = Util.queryTemplate($("#result-table tbody"), ".zxf_pagediv", $(".button button"), function(page, size, cb) {
        var data = {
            pageNum: page,
            pageSize: size,
        };
        var v = $(".f1 input").val().trim();
        if (v) data.start = v;
        var v = $(".f2 input").val().trim();
        if (v) data.end = v;
        var v = $(".f9 select").val();
        if (v != -1) data.state = v;
        var v = $(".f8 select").val();
        if (v != -1) data.channel3 = v;
        var v = $(".f3 input").val().trim();
        if (v) {
            data[$(".f5 select").val()] = v;
        }
        var v = $(".f7 select").val();
        if (v != -1) data.type = v;
        
        if (data.end && data.start && 
            new Date(data.end).getTime() - new Date(data.start).getTime() > 7 * 24 * 3600 * 1000) {
            alert2("查询的时间跨度，不能超过7天");
            return;
        }

        Util.savePageFilter([".f1 input", ".f2 input", ".f9 select", ".f8 select", ".f3 input", ".f6 select", ".f7 select"]);
        startLoading();
        CMD.payment_query(data, function(r) {
            stopLoading();
            cb(r);
        });
    }, function(table, list, sum) {
        if (Util.isEmpty(list)) {
            table.append("<tr><td colspan='10'>暂无数据</tr>");
            return;
        }

        // 合计
        var tr = $("<tr></tr>");
        tr.append("<td colspan='6'>合计</td>");
        tr.append("<td>" + ((sum || 0)/100).toFixed(2) + "</td>");
        tr.append("<td colspan='3'> </td>");
        table.append(tr);

        for (var i in list) {
            var d = list[i];
            var tr = $("<tr></tr>");
            tr.append("<td>" + d.id + "</td>");
            tr.append("<td>" + d.start.substring(5) + "</td>");
            if (!d.end)
                tr.append("<td> </td>");
            else
                tr.append("<td>" + d.end.substring(5) + "</td>");
            tr.append("<td class='name'>" + (d.user.mobile || '游客') + "</td>");
            var layer = Layer.config[d.user.layer + ""] || {};
            tr.append("<td>" + (layer.name || '') + "</td>");
            
            // 充值类型
            var type = Util.convert3rdType(d.type);
            var channel3 = '-';
            if (d.channel3 == 'bank') channel3 = '在线网银';
            else if (d.channel3 == 'alipay') channel3 = '支付宝';
            else if (d.channel3 == 'wechat') channel3 = '微信';
            else if (d.channel3 == 'qq') channel3 = 'QQ钱包';
            tr.append("<td>" + type + "/" + channel3 + "</td>");

            tr.append("<td>" + (d.amount/100) + "</td>");

            // 摘要
            var memo = '商户订单号：' + d.orderNo;
            if (d.tradeNo) {
                memo += "<br>平台订单号：" + d.tradeNo;
            }
            tr.append("<td class='l'>" + memo + "</td>");
            
            // 状态 
            var state = "待充值";
            if (d.state == 1) state = "完成";
            else if (d.state == 2) state = "失败";
            tr.append("<td>" + state + "</td>");

            // 操作
            if (d.state == 0) {
                var oper = '<button class="check" value="__id__">检查</button>\
                <button class="success" value="__id__">确认到账</button>'.replace(/__id__/g, d.id);
                tr.append("<td>" + oper + "</td>");
            }
            else {
                tr.append("<td></td>");
            }
            table.append(tr);
        }
        
        table.find("button.check").click(function(e) {
            var id = $(e.currentTarget).attr("value");
            CMD.payment_notice(id, function(r) {
                _f();
            });
        })
        table.find("button.success").click(function(e) {
            var id = $(e.currentTarget).attr("value");
            if (!confirm("点击确认后，款项将直接打给用户，请慎重操作。一般只用于人工补单！")) return;
            CMD.payment_success(id, function(r) {
                _f();
            });
        })
    });
</script>
